<!-- 退款 -->
<template>
    <div>
        <div class="van-head">
            <van-config-provider :theme-vars="themeVars">
                <van-nav-bar
                title="申请退款"
                right-text="提交"
                left-arrow
                :border="false"
                fixed="true"
                style=" background-color: #eae9e5 ;"
                @click-left="onClickLeft"
                @click-right="onClickRight(route.query.id)"
                />
                <div style=" height: 46px;"></div>
                <div style="padding: 20px 20px;">
                    <span>退款原因</span>
                    <van-divider :style="{ borderColor:'#eae9e5'}"/>
                    <div style=" width: 100%; ">
                        <textarea style=" width: 100%; overflow: auto; border: 0px;" cols="100" rows="6" placeholder="请填写退款详情（选填）"></textarea>
                        <van-divider :style="{ borderColor:'#eae9e5'}"/>
                        <span style="color: gray;">图片描述（选填）</span>
                        <van-uploader style="margin-top: 20px;" v-model="fileList" multiple />
                    </div>
                </div>
            </van-config-provider>
        </div>
    </div>
</template>
<script setup lang="ts">
import { ref ,watch} from 'vue';
import { Toast } from 'vant';
import { useRouter,useRoute } from "vue-router";
const router =useRouter();
const route =useRoute();
const onClickLeft = () => history.back();
const themeVars = {
    NavBarIconColor:'#c1ab96',
    FontWeightBold:'550',
    NavBarTextColor:'#c1ab96'
};
const onClickRight = (id) => {
    Toast.success({
        message: '提交成功!',
        icon: 'passed',
    });
    router.push({path:'/details1',query:{id:id}})
};
const fileList = ref([
    { url: 'https://fastly.jsdelivr.net/npm/@vant/assets/leaf.jpeg' },
    { url: 'https://fastly.jsdelivr.net/npm/@vant/assets/leaf.jpeg', isImage: true },
]);
</script>
<style>

</style>